.slide-enter-active {
  transition: all .3s ease;
}
.slide-leave-active {
  transition: all .3s ease;
}
.slide-leave-to{
  transform: translateX(-100%);
  opacity: 0;
}
.slide-enter{
  transform: translateX(100%);
  opacity: 0;
}

.router-enter-active {
  transition: all .3s ease;
}
.router-leave-active {
  transition: all .3s ease;
}
.router-leave-to{
  transform: translateX(100%);
}
.router-enter{
  transform: translateX(100%);
}

.popup-enter-active {
  transition: all .3s ease;
}
.popup-leave-active {
  transition: all .3s ease;
}
.popup-leave-to{
  transform: translateY(100%);
}
.popup-enter{
  transform: translateY(100%);
}

.fade-enter-active, .fade-leave-active {
  transition: opacity .3s ease;
}
.fade-enter, .fade-leave-to{
  opacity: 0;
}
